<template>
<div class="layerRtb layerRtb-threecolumn">
     <three-title :title="{name:'思维'}"></three-title>
    <div class="layerRtb-scroll thinScroll" v-scrollHeight = "137">
        <div>
            <div class="analyItem" >
                <p class="analyItemTit tx-center">思维</p>
                <div class="analyItemCon">
                    <p class="col-md-12 mb20">
                        <el-checkbox-group v-model="checkList">
                            <el-checkbox @change="change(39)" label="39" data-title="对事物甲乙分析，从中抽象出共同的属性或特征加以归纳" >分析性</el-checkbox>
                            <el-checkbox @change="change(40)" label="40" data-title="凭借知识、经验对客观事物进行的间接的反应" >理论性</el-checkbox>
                            <el-checkbox @change="change(41)" label="41" data-title="有一定的形式、方法，并按着一定的规律进行" >逻辑性</el-checkbox>
                            <el-checkbox @change="change(42)" label="42" data-title="善于深入地思考问题，抓住事物的规律和本质，预见事物的发展进程" >深究性</el-checkbox>
                            <el-checkbox @change="change(43)" label="43" data-title="从不同角度、方向、方面，能用多种方法来解决问题" >灵活性</el-checkbox>
                            <el-checkbox @change="change(44)" label="44" data-title="独立思考创造出有价值的、具有新颖性成分的产物" >创新性</el-checkbox>
                            <el-checkbox @change="change(45)" label="45" data-title="能够适应迫切的情况来积极地思维，周密地考虑，正确地判断和迅速地作出结论" >敏捷性</el-checkbox>
                        </el-checkbox-group>
                    </p>
                    <p class="col-md-12">
                        <span class="cLightGray pr8 col-md-1">备注:</span>
                        <span class="col-md-8">
                         <el-input  v-model="input" placeholder="输入备注"></el-input>
                        </span>
                        <span class="col-md-22 ">
                         <el-button class="fr"  @click="confirm(1,input)" type="primary">确定</el-button>
                        </span>
                    </p>
                     <span style="top:20%" :class="['circlemark', SWsecList.isPresence==null ? 'circlemark-purple' : 'circlemark-lightGreen']" >{{SWsecList.isPresence==null?'待':'完'}}</span>

                </div>
            </div>
        </div>
    </div>
    <div class="layerRtb-footer">
        <div class="analyItem">
            <p class="analyItemTit tx-center">综合</p>
            <div class="analyItemCon">
                <p class="col-md-10">
                    <span class="col-md-1 cLightGray ">备注</span>
                    <span  class="col-md-8 lh20">
                        <el-input v-model="inputHandel"  placeholder="请输入处理备注..."></el-input>
                    </span>
                </p>
                     <span style="top:20%" :class="['circlemark', SWList.isPresence==null ? 'circlemark-purple' : 'circlemark-lightGreen']" >{{SWList.isPresence==null?'待':'完'}}</span>

            </div>
        </div>
        <div class="tx-center">
            <el-button @click="confirm(2,inputHandel)" type="primary">保存</el-button>
        </div>
    </div>

</div>
</template>
<script>
import { mapGetters } from 'vuex'
import { saveTrickData } from '../../Resources/Api'
export default {

    data () {
        return {
            SWList: {},
            SWsecList: {},

            inputHandel: '',
            input: '',
            checkList: [],
            arrcheckList: []
        }
    },

    computed: {
        ...mapGetters(['leftInfo', 'userInfo'])
    },
    created () {
        this.SWList = this.$route.query.SWList
        this.break()
    },
    methods: {
        change (val) {
            this.arrcheckList.forEach(item => {
                if (Number(item) === val) {
                    this.saveTrickData(val, null, 0)
                }
            })
        },
        break () {
            // 综合备注
            if (this.SWList.isPresence !== null) {
                this.inputHandel = this.SWList.isPresence[0].remake
            }
            this.SWList.stageMediumType.forEach(element => {
                if (Number(element.exclusiveId) === 11) {
                    this.$nextTick(() => {
                        this.SWsecList = element
                    })
                    // 思维选项
                    element.stageSmallType.forEach(item => {
                        if (item.isPresence !== null) {
                            this.checkList.push(String(item.exclusiveId))
                            this.arrcheckList.push(String(item.exclusiveId))
                        } else {
                            this.input = ''
                        }
                    })
                    // 思维备注
                    if (element.isPresence !== null) {
                        this.input = element.isPresence[0].remake
                    }
                }
            })
        },
        confirm (flg, input) {
            if (flg === 1) {
                if (input === '') {
                    layer.msg('输入备注')
                    return
                }
                if (Number(this.checkList.length) === 0) {
                    layer.msg('尚未选择')
                    return
                }
                this.checkList.forEach(item => {
                    this.saveTrickData(item, null)
                })
                this.saveTrickData(11, input)
            }
            if (flg === 2) {
                if (input === '') {
                    layer.msg('输入备注')
                    return
                }
                if (this.SWsecList.isPresence !== null) {
                    this.saveTrickData(4, input)
                } else {
                    layer.msg('尚未完善信息')
                }
            }
        },
        saveTrickData (val, input, deflg) {
            saveTrickData({
                user_card_no: this.leftInfo.cardNo, // 卡号
                userName: this.leftInfo.userName, // 姓名
                remake: input, // 备注
                operatorCard: this.userInfo.as_cardNo, // 操作人
                operatorName: this.userInfo.as_userName, // 操作人姓名
                exclusiveId: val, // 专属ID
                delFlag: deflg

            }).then(res => {
                if (deflg === 0) {
                    return
                }
                if (res.data.StatusCode === 0) {
                    layer.msg('保存成功')
                }
            }).catch(error => {
                console.log(error)
            })
        }
    },
    watch: {
        leftInfo () {
        },
        $route () {
        }
    }
}
</script>
